<html>
<head>
    <title>Javascript Change CSS Class of Div tag</title>
   
    <style type="text/css">
   
    .redText,.blueText {
        width: 200px;
        font-family: Arial;
    }
   
    .redText {
        color : red
     }
    
     .blueText {
        color : blue
     }

    </style>

    <script language="javascript" type="text/javascript">
   
        function changeCssClass(objDivID)
        {
            if(document.getElementById(objDivID).className=='redText')
            {
                document.getElementById(objDivID).className = 'blueText';
            }
            else
            {
                document.getElementById(objDivID).className = 'redText';
            }
        }
       
    </script>

</head>
<body>

    <center>
        <div id="div1" class="redText">
        By default text indside this HTML div tag is red.
        Javascript function will change the CSS class<br />
        of this Div tag and <br />
        text color will change to blue dynamically.
        </div>
        <br />
        <input type="button" value="click here" onclick="changeCssClass('div1')" />
    </center>

</body>
</html>